<template>
	<view>
		<u-subsection bgColor="#F8F8F8" :list="categoryList" :current="listType" mode="button" @change="changeListType"
			class="top">
		</u-subsection>
		<uni-collapse>
			<uni-collapse-item :title="item.title" v-for="(item, index) in scienceList[listType]" :key="item.id"
				class="science">
				<view class="scienceInfo">
					<text>{{item.content}}</text>
				</view>
			</uni-collapse-item>
		</uni-collapse>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				categoryList: ['鸽场介绍', '鸽子相关'],
				listType: 0,
				scienceList: []
			}
		},
		onLoad() {
			this.getScience();
		},
		methods: {
			changeListType(index) {
				this.listType = index;
			},
			async getScience() {
				const res = await this.$myRequest({
					url: 'staticinfo/applet/getScience',
					method: 'get'
				})
				if (res && res.code === 0) {
					this.scienceList = res.scienceList;
					this.categoryList = res.categoryList;
				}
			}
		}
	}
</script>

<style lang="scss">
	.scienceInfo {
		padding: 15px;

		text {
			font-size: 14px;
			color: #666;
			line-height: 20px;
		}
	}
</style>
